<template>
  <div>
    <el-tree
      ref="mytree"
      :data="data"
      :props="defaultProps"
      node-key="cat_id"
      @node-click="change"
      :default-expanded-keys="expandedKeys"
      :expand-on-click-node="false">
  <span class="custom-tree-node" slot-scope="{ node, data }">
    <span>{{ data.name }}</span>
  </span>
 </el-tree>

  </div>
</template>

<script>
import category from "@/api/product/PmsCategory.js";

export default {
  name: 'category',
  data() {
    return {
      data:[],
      expandedKeys:[],
      defaultProps: {
        children: 'children',
        label: 'name'
      },
    }
  },
  methods: {
    change(data,node){
       if (node.level===3){
         //只有当自己是3级节点的时候才触发
         this.$emit("handler","changeNode",data.cat_id)
       }
    },
    getAllCategory() {
      category.findTree().then((res) => {
         this.data=res.list
      });
    },
  },
  created() {
    this.getAllCategory();
  }
}
</script>

<style scoped>

</style>
